<template>
	<el-dialog :title="dialogTitle" :visible.sync="visible" fullscreen append-to-body custom-class="test_paper_dialog">
		<paper-chapter v-model="paperChapterList" :type="formData.paperType" :total-score="scoreTotal"></paper-chapter>
		<div class="test_paper_info">
			<sw-tabs v-model="formData.paperType" :options="paperTypes" :disabled="!addOrEdit"></sw-tabs>
			<el-form ref="form" size="medium" :model="formData" :rules="formRules" label-position="top" label-width="80px">
				<el-form-item label="试卷名称" prop="name">
					<el-input v-model="formData.name" placeholder="请输入试卷名称"></el-input>
				</el-form-item>
				<el-form-item label="试卷分类" prop="paperClassId">
					<el-select v-model="formData.paperClassId" placeholder="请选择试卷分类" style="width: 100%">
						<el-option v-for="(item, index) in paperClassifys" :key="index" :label="item.name" :value="item.id" />
					</el-select>
				</el-form-item>
				<el-form-item label="访问权限" prop="permission">
					<el-radio-group v-model="formData.permission" v-removeAriaHidden:radio>
						<el-radio label="1">完全私有</el-radio>
						<el-radio label="2">只读共享</el-radio>
					</el-radio-group>
				</el-form-item>
				<el-form-item label="试卷状态" prop="status">
					<el-radio-group v-model="formData.status" v-removeAriaHidden:radio>
						<el-radio label="1">正常</el-radio>
						<el-radio label="2">禁用</el-radio>
					</el-radio-group>
				</el-form-item>
				<el-form-item label="试卷说明">
					<el-input type="textarea" v-model="formData.des" resize="none" :autosize="{ minRows: 6, maxRows: 8 }" />
				</el-form-item>
			</el-form>
			<div class="button">
				<el-button size="medium" @click="visible = false">取消</el-button>
				<el-button size="medium" type="primary" @click="handleSubmitForm()">{{ formTypeName }}</el-button>
			</div>
		</div>
	</el-dialog>
</template>

<script>
	import lodash from 'lodash';
	import Sortable from 'sortablejs';
	import paperChapter from './chapter';
	import formMixins from '@/mixins/formMixins';
	import { queryPapers, addedPapers, updatePapers } from '@/api/exam/testPaper';
	export default {
		mixins: [formMixins],
		components: { paperChapter },
		data() {
			return {
				formName: '试卷',
				formRules: {
					name: [{ required: true, message: '请输入试卷名称', trigger: 'blur' }],
					status: [{ required: true, message: '请选择试卷状态', trigger: 'change' }],
					permission: [{ required: true, message: '请选择访问权限', trigger: 'change' }],
					paperClassId: [{ required: true, message: '请选择试卷分类', trigger: 'change' }]
				},
				paperTypes: [
					{ id: '1', label: '普通试卷' },
					{ id: '2', label: '随机试卷' }
				],
				paperChapterList: []
			};
		},
		computed: {
			detailData() {
				return eval(queryPapers);
			},
			callFunction() {
				return eval(this.addOrEdit ? addedPapers : updatePapers);
			},
			paperClassifys() {
				let classifys = this.$store.getters.classifyData || [];
				return classifys.filter((n) => n.classType === '1');
			},
			scoreTotal() {
				let scoreArrs = this.paperChapterList.map((item) => {
					let subjects = item?.testSubjectVO || [];
					return subjects.map((n) => {
						if (this.formData.paperType === '1') {
							return parseInt(n.score)
						} else if (this.formData.paperType === '2') {
							return Number(n.ruleVo.score) * Number(n.ruleVo.subjectNum);
						}
					});
				});
				console.log(scoreArrs);
				return lodash.sumBy(scoreArrs, (n) => lodash.sum(n));
			},
			submitParams() {
				let params = { ...this.formData };
				if (this.addOrEdit) {
					params['totalScore'] = 0;
					params['testPaperChapterList'] = [];
				} else {
					params['totalScore'] = this.scoreTotal;
					params['testPaperChapterList'] = this.paperChapterList;
				}
				return params;
			}
		},
		methods: {
			formatFormParams(data) {
				let chapterList = data.testPaperChapterList || [];
				this.paperChapterList = [];
				if (this.addOrEdit) {
					this.$set(this.formData, 'paperType', '1');
				}
				if (!this.addOrEdit && chapterList.length > 0) {
					this.paperChapterList = chapterList.map((item) => {
						return { ...item, setScore: 1 };
					});
				} else {
					let mark = this.$genUUID();
					let obj = { title: '', des: '', orderBy: '1', setScore: 1 };
					this.paperChapterList.push({ ...obj, mark, testSubjectVO: [] });
				}
			}
		}
	};
</script>
<style lang="scss">
	.test_paper_dialog .el-dialog__body {
		padding: 0;
	}
</style>
<style lang="scss" scoped>
	.test_paper_info::v-deep {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		min-width: 320px;
		max-width: 420px;
		flex-shrink: 0;
		width: 25%;

		.el-form {
			flex: 1;
			overflow: auto;
			padding: 16px 16px 0;
		}

		.button {
			padding: 16px;
			text-align: right;
			border-top: solid 1px #e4e7ed;
		}

		.el-form-item {
			margin-bottom: 28px;
		}

		.el-form-item__label {
			font-size: 15px;
			font-weight: bold;
		}

		.el-form-item__content {
			line-height: 1;
		}
	}
</style>